<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        body{
            background-color: #F2F2F2;
        }
        #content {
            display: flex;
            justify-content: center;
            align-items: center;
            height: 600px;
        }

        #beautiful {
            display: flex;
            justify-content: center;
            align-items: center;
            flex-direction: column;
            border: 1px solid;
            height: 200px;
            width: 320px;
            background-color: #fff;
            box-shadow: 5px 5px 2.5px #888888;
            border-radius: 10px;
        }
        #btnLogin{
            margin-top: 10px;
        }
        #btnCancel{
            margin-left: 40px;
        }

        
    </style>
</head>

<body>
    <div id="content">
        <div id="beautiful">
            <div>
                <h3>欢迎使用胡来管理系统</h3>
            </div>
            <table>
                <tr>
                    <td>
                        <label for="">用户名：</label>
                    </td>
                    <td>
                        <input type="text" name="username">
                    </td>
                </tr>
                <tr>
                    <td>
                        <label for="">密码：</label>
                    </td>
                    <td>
                        <input type="password" name="password">
                    </td>
                </tr>
                <!-- <tr id="btnLogin">
                    <td>
                        <input type="button" value="登录" onclick="login()">
                    </td>
                    <td>
                        <input type="button" value="取消">
                    </td>
                </tr> -->
            </table>
            <div id="btnLogin">
                <input type="button" value="登录" onclick="login()">
                <input id="btnCancel" type="button" value="取消">
            </div>
        </div>

    </div>

    <script src="./js/jquery-3.6.0.min.js"></script>
    <script src="./config/request.js"></script>
    <script>
        function login() {
            let username = $('[name=username]').val();
            let password = $('[name=password]').val();
            // console.log(username);
            let obj = {
                username,
                password
            }
            console.log(obj);
            $.post(`${baseUrl}/login`, obj, (res) => {
                console.log(res);
                if (res.code === 1000) {
                    window.location.href = './index.html';
                } else {
                    alert(res.msg);
                }
            })
        }

    </script>
</body>

</html>